<template>
  <div ref="searchRef" class="p-1 pt-4">
    <div>
      <form-container :inline="true" :schema="props.searchFormSchema" v-model="searchData" :actions="props.searchActions" @handleOperateAction="handleOperate"/>
    </div>
  </div>
</template>
<script setup lang="ts" name="search">
import _ from 'lodash-es'
import { TableSearchSchemaRowType, TableSearchDataType } from 'types/table'
import { FormButtonType } from 'types/form'
import { objTKV } from '@/utils/_'
import { watch } from 'vue';
import { ref } from 'vue';
interface TableSearchPropsType {
  searchFormSchema: TableSearchSchemaRowType[],
  searchActions: FormButtonType[],
  modelValue: TableSearchDataType | undefined,
}

const props = defineProps<TableSearchPropsType>();

const searchRef = ref()
let searchData = ref(props.modelValue)

const emits = defineEmits(["handleOperateAction",'update:modelValue']);

watch(() => searchData,(n,o) => {
  emits('update:modelValue',n)
},{deep:true})


function handleOperate(call: any)  {
  
  emits('handleOperateAction',call.action,call.data)
}

function changeFormModel(e:any) {
  
}

defineExpose({searchRef})
</script>

<style scoped></style>

